<template>
    <TableList
        :columns="recordCol"
        :data="recordList"
        :page.sync="query.pageIndex"
        :size.sync="query.pageSize"
        :total="recordTotal"
        @queryFun="getReportRecord"
    >
        <!-- <template slot-scope="{ row }" slot="grade">
            <RadioGroup
                v-model="row.grade"
                @on-change="
                    (val) => {
                        return scoreClassReport({ id: row.id, grade: val });
                    }
                "
            >
                <Radio :label="1">
                    差
                </Radio>
                <Radio :label="2">
                    良
                </Radio>
                <Radio :label="3">
                    优
                </Radio>
            </RadioGroup>
        </template> -->
    </TableList>
</template>
<script>
import { queryClassReport, scoreClassReport } from '@/api/selfStudy/class_new.js';
export default {
    name: 'answerRecord',
    props: ['classNumberId', 'disbledAllBtn', 'classId', 'status'],
    data() {
        return {
            recordList: [],
            recordTotal: 0,
            query: {
                pageIndex: 1,
                pageSize: 10
            },
            recordCol: [
                //学员名称 课件名称 题目数量 答题数量 正确数量 详情进入查看这个学员的答题详情
                {
                    type: 'index',
                    title: '序号'
                },
                {
                    title: '学员昵称',
                    key: 'userName'
                },
                //					{
                //						title:'课件名称',
                //						key:'ecName'
                //					},
                {
                    title: '报告名称',
                    key: 'reportFileName',
                    render: (h, params) => {
                        if (params.row.reportFileRecordId) {
                            return h(
                                'a',
                                {
                                    attrs: {
                                        href:
                                            '/api/minio/download/' + params.row.reportFileRecordId,
                                        download: '',
                                        title: '点击导出'
                                    },
                                    style: {
                                        //		                			color:'#fff'
                                    }
                                },
                                params.row.reportFileName
                            );
                        } else {
                            return h('span', '-');
                        }
                    }
                },
                {
                    title: '评级',
                    key: 'grade',
                    render: (h, params) => {
                        return h(
                            'RadioGroup',
                            {
                                props: {
                                    value: params.row.grade
                                },
                                on: {
                                    'on-change': (val) => {
                                        let data = {
                                            id: params.row.id,
                                            grade: val
                                        };
                                        this.scoreClassReport(data);
                                    }
                                }
                            },
                            [
                                //								h('Radio',{
                                //								  props:{
                                //								    label:0,
                                //								    disabled:this.disbledAllBtn
                                //								  },
                                //								  style:{
                                //								    marginRight:'5px'
                                //								  },
                                //								},'未学'),
                                h(
                                    'Radio',
                                    {
                                        props: {
                                            label: 1,
                                            disabled:
                                                this.disbledAllBtn || !params.row.reportFileRecordId
                                        },
                                        style: {
                                            marginRight: '5px'
                                        }
                                    },
                                    '差'
                                ),
                                h(
                                    'Radio',
                                    {
                                        props: {
                                            label: 2,
                                            disabled:
                                                this.disbledAllBtn || !params.row.reportFileRecordId
                                        },
                                        style: {
                                            marginRight: '5px'
                                        }
                                    },
                                    '良'
                                ),
                                h(
                                    'Radio',
                                    {
                                        props: {
                                            label: 3,
                                            disabled:
                                                this.disbledAllBtn || !params.row.reportFileRecordId
                                        },
                                        style: {
                                            marginRight: '5px'
                                        }
                                    },
                                    '优'
                                )
                            ]
                        );
                    }
                },
                {
                    title: '操作',
                    key: 'action',
                    opList: [
                        {
                            txt: '预览',
                            disabled: (data) => {
                                return !data.reportFileRecordId;
                            },
                            fun: (data) => {
                                //新的预览接口
                                window.openTrain(`/api/minio/filePreview?id=${data.reportFileRecordId}`);
                            }
                        }
                    ]
                }
            ],
            timeout: ''
        };
    },
    watch: {
        classNumberId: function(val) {
            this.getReportRecord();
        }
    },
    filters: {},
    created() {},
    mounted() {
        if (this.classNumberId) {
            this.getReportRecord();
        }
    },
    beforeDestroy() {
        clearTimeout(this.timeout);
    },
    methods: {
        // getData(page, size) {
        //     this.query.pageIndex = page;
        //     this.query.pageSize = size;
        //     if (this.classNumberId) {
        //         this.getReportRecord();
        //     }
        // },
        getReportRecord() {
            queryClassReport(this.classId, this.classNumberId, this.query)
                .then((data) => {
                    if (data.code == 1) {
                        this.recordList = [];
                        this.$nextTick(() => { //评级匹配问题
                            this.recordList = data.data.items;
                        });
                        this.recordTotal = data.data.total;
                        let hasReport = data.data.report;
                        this.$emit('disDownload', !hasReport);
                        clearTimeout(this.timeout);
                        // if (this.status !== 0) {
                        this.timeout = setTimeout(() => {
                            this.getReportRecord();
                        }, 5000);
                        // }
                    } else {
                        this.$Message.warning(data.message);
                    }
                })
                .catch((error) => {
                    this.$Message.error(error.message);
                });
        },
        changePage(page) {
            this.query.pageIndex = page;
            this.getReportRecord();
        },
        scoreClassReport(report) {
            scoreClassReport(report)
                .then((data) => {
                    if (data.code == 1) {
                        this.$Message.info('评级成功');
                    } else {
                        this.$Message.warning('评级失败');
                        this.getReportRecord();
                    }
                })
                .catch((error) => {
                    this.getReportRecord();
                    this.$Message.error(error.response.data.message);
                });
        }
    }
};
</script>
<style scoped></style>
